<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/style.css">

    <script src="js/jquery.min.js"></script>
    <script src="bootstrap/js/bootstrap.min.js"></script>
    <script src="js/footer.js"></script>
    <title>首页</title>
    <style>
        /* 轮播图 */
        
        .carousel,
        .carousel img {
            width: 100%;
            height: 550px!important;
            margin: 0 auto;
        }
    </style>
</head>

<body>

    <!-- header模块 -->
    <div class="header">
        <div class="w">
            <div class="logo fl">
                <a href="index.html"><img src="images/logo.png" alt=""></a>
            </div>
            <ul class="fl">
                <li class="active">
                    <a href="index.html">首页</a>
                </li>
                <li>
                    <a href="study.html">学习中心</a>
                </li>
                <li>
                    <a href="news.html">校园资讯</a>
                </li>
                <li>
                    <a href="personal-course.html">个人中心</a>
                </li>
                <li>
                    <a href="message.html">留言</a>
                </li>
            </ul>
            <!-- 搜索框 -->
            <div class="input-search fl">
                <input type="search" class="search" id="search" placeholder="搜索...">
                <span class="glyphicon glyphicon-search"></span>
            </div>
            <!-- 登录注册按钮 -->
            <div class="fl">
                <a href="javascript:;" class="login">登录/注册</a>
            </div>
        </div>
    </div>
    <!-- 轮播图模块 -->
    <div id="myCarousel" class="carousel slide">
        <!-- 轮播（Carousel）指标 -->
        <ol class="carousel-indicators">
            <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
            <li data-target="#myCarousel" data-slide-to="1"></li>
            <li data-target="#myCarousel" data-slide-to="2"></li>
        </ol>
        <!-- 轮播（Carousel）项目 -->
        <div class="carousel-inner">
            <div class="item active">
                <img src="images/banner3.png" alt="...">
            </div>
            <div class="item">
                <img src="images/banner2.png" alt="...">
            </div>
            <div class="item">
                <img src="images/banner1.png" alt="...">
            </div>
        </div>
        <!-- 轮播（Carousel）导航 -->
        <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
            <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
            <span class="sr-only">Previous</span>
        </a>
        <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
            <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
            <span class="sr-only">Next</span>
        </a>
    </div>
    <!-- service模块 -->
    <div class="service">
        <div class="w">
            <div class="service-hd">
                <h1>服务</h1>
                <hr>
                <p>用户在高强度、压抑的学习中，可以分享学习成果，记录心情!</p>
            </div>
            <div class="service-bd">
                <ul>
                    <li>
                        <a href="study.html"><img src="images/index-study.png" alt=""></a>
                        <h3>学习中心</h3>
                        <p>可享受线上学习，互动交流</p>
                    </li>
                    <li>
                        <a href="news.html"><img src="images/index-news.png" alt=""></a>
                        <h3>校园资讯</h3>
                        <p>校园新闻实时查看浏览</p>
                    </li>
                    <li>
                        <a href="personal-course.html"><img src="images/index-personal.png" alt=""></a>
                        <h3>个人中心</h3>
                        <p>个人数据统计，信息存储</p>
                    </li>
                    <li style="margin-right:0;">
                        <a href="message.html"><img src="images/index-message.png" alt=""></a>
                        <h3>留言</h3>
                        <p>任何留言都可反馈给我们</p>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 精品课程-->
    <div class="programme">
        <div class="w">
            <div class="pro-title">
                <h1>精品课程</h1>
                <hr>
            </div>
            <div class="pro-hd">
                <ul>
                    <li class="active"><a href="javascript:;">热门</a></li>
                    <li><a href="javascript:;">初级</a></li>
                    <li><a href="javascript:;">中级</a></li>
                    <li><a href="javascript:;">高级</a></li>
                </ul>
                <h1> <a href="javascript:;">查看全部 <span style="font-size:5px;"> ● ● ●</span></a></h1>
            </div>
            <div class="pro-bd">
                <ul>
                    <li>
                        <div class="empty">
                            <img src="images/video.png" alt="">
                        </div>
                        <img src="images/index-course1.png" alt="" class="hide-pic">
                        <a href="study-detail.html">
                            <h4>
                                航空航天概论
                            </h4>
                        </a>
                        <div class="info">
                            <span>高级</span> • 1125人在学习
                        </div>
                    </li>
                    <li>
                        <div class="empty">
                            <img src="images/video.png" alt="">
                        </div>
                        <img src="images/index-course2.png" alt="" class="hide-pic">
                        <a href="javascript:;">
                            <h4>
                                民族学导论
                            </h4>
                        </a>
                        <div class="info">
                            <span>高级</span> • 1125人在学习
                        </div>
                    </li>
                    <li>
                        <div class="empty">
                            <img src="images/video.png" alt="">
                        </div>
                        <img src="images/index-course3.png" alt="" class="hide-pic">
                        <a href="javascript:;">
                            <h4>
                                园林花卉应用设计
                            </h4>
                        </a>
                        <div class="info">
                            <span>高级</span> • 1125人在学习
                        </div>
                    </li>
                    <li>
                        <div class="empty">
                            <img src="images/video.png" alt="">
                        </div>
                        <img src="images/index-course4.png" alt="" class="hide-pic">
                        <a href="javascript:;">
                            <h4>
                                大数据基础与应用
                            </h4>
                        </a>
                        <div class="info">
                            <span>高级</span> • 1125人在学习
                        </div>
                    </li>
                    <li style="margin-right:0;">
                        <div class="empty">
                            <img src="images/video.png" alt="">
                        </div>
                        <img src="images/index-course5.png" alt="" class="hide-pic">
                        <a href="javascript:;">
                            <h4>
                                Java程序设计
                            </h4>
                        </a>
                        <div class="info">
                            <span>高级</span> • 1125人在学习
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 校园新闻早知道 -->
    <div class="news">
        <div class="w">
            <div class="news-hd">
                <h1>校园新闻早知道</h1>
                <hr>
                <a href="news.html">更多资讯 <span style="font-size:5px;"> ● ● ●</span></a>
            </div>
            <div class="news-bd">
                <ul>
                    <li>
                        <div class="empty">
                            <h4>学校启动系列...</h4>
                            <p>为大力弘扬奉献、友爱、互助、进步的志愿者精神...</p>
                            <a href="news-detail.html"><i class="glyphicon glyphicon-searchglyphicon glyphicon-search"></i></a>
                        </div>
                        <img src="images/index-news1.png" alt="">
                    </li>
                    <li>
                        <div class="empty">
                            <h4>学校启动系列...</h4>
                            <p>为大力弘扬奉献、友爱、互助、进步的志愿者精神...</p>
                            <a href="news-detail.html"><i class="glyphicon glyphicon-searchglyphicon glyphicon-search"></i></a>
                        </div>
                        <img src="images/index-news2.png" alt="">
                    </li>
                    <li>
                        <div class="empty">
                            <h4>学校启动系列...</h4>
                            <p>为大力弘扬奉献、友爱、互助、进步的志愿者精神...</p>
                            <a href="news-detail.html"><i class="glyphicon glyphicon-searchglyphicon glyphicon-search"></i></a>
                        </div>
                        <img src="images/index-news3.png" alt="">
                    </li>
                    <li>
                        <div class="empty">
                            <h4>学校启动系列...</h4>
                            <p>为大力弘扬奉献、友爱、互助、进步的志愿者精神...</p>
                            <a href="news-detail.html"><i class="glyphicon glyphicon-searchglyphicon glyphicon-search"></i></a>
                        </div>
                        <img src="images/index-news4.png" alt="">
                    </li>
                </ul>
            </div>
        </div>
    </div>

    <!-- 平台发展 -->
    <div class="culture">
        <div class="w">
            <div class="culture-hd">
                <h1>平台发展</h1>
                <hr>
                <p>用户在高强度、压抑的学习中，可以分享学习成果，记录心情!</p>
            </div>
            <div class="culture-bd">
                <table>
                    <tr>
                        <td>
                            <h1>2016-2017</h1>
                            <h1>平台初步上线</h1>
                            <p>线上教学冲击互联网市场</p>
                            <p>教育模式发生转变</p>
                            <p>商业大佬陆续投资</p>
                        </td>
                        <td>
                            <img src="images/index-culture1.png" alt="">
                            <span></span>
                        </td>
                        <td></td>
                    </tr>
                    <tr>
                        <td></td>
                        <td>
                            <img src="images/index-culture2.png" alt="">
                            <span></span>
                        </td>
                        <td>
                            <h1>2017-2018</h1>
                            <h1>特大投资商加盟</h1>
                            <p>产业链迅速提升</p>
                            <p>集团逐渐壮大</p>
                            <p>市场份额占比直线上升</p>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <h1>2018-2019</h1>
                            <h1>竞争对手增多</h1>
                            <p>商业模式有待创新，营销策略有待创新，各部门加强工作</p>
                        </td>
                        <td>
                            <img src="images/index-culture3.png" alt="">
                            <span></span>
                        </td>
                        <td></td>
                    </tr>
                    <tr>
                        <td></td>
                        <td>
                            <img src="images/index-culture4.png" alt="">
                            <span></span>
                        </td>
                        <td>
                            <h1>2019-2020</h1>
                            <h1>未来可期</h1>
                            <p>集团发展蒸蒸日上</p>
                            <p>各部门有序工作</p>
                            <p>产业链稳定</p>
                        </td>
                    </tr>
                    <tr>
                        <td></td>
                        <td>
                            <div class="over">敬请期待</div>
                        </td>
                        <td></td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
    <!-- footer模块 -->
    <div class="footer">
        <div class="w">
            <div class="top">
                <div class="fl">
                    <div class="logo">
                        <a href="index.html"><img src="images/logo.png" alt=""></a>
                    </div>
                    <h5>用户在高强度、压抑的学习中，可以分享学习成果，记录心情!</h5>
                </div>
                <div class="fl">
                    <ul>
                        <li>
                            <h3>关于我们</h3>
                            <a href="javascript:;">集团概况</a>
                            <a href="javascript:;">集团部门</a>
                            <a href="javascript:;">发展历史</a>
                            <a href="javascript:;">法律条款</a>
                        </li>
                        <li>
                            <h3>联系我们</h3>
                            <a href="javascript:;">常见问题</a>
                            <a href="javascript:;">意见反馈</a>
                            <a href="javascript:;">资讯投稿</a>
                            <a href="javascript:;">加入我们</a>
                        </li>
                        <li>
                            <h3>关注我们</h3>
                            <div class="wechat">
                                <img src="images/wechat.png" alt="" id="wechat">
                            </div>
                            <div class="weibo">
                                <img src="images/weibo.png" alt="" id="weibo">
                            </div>
                        </li>
                        <li style="margin-right:0;">
                            <h3>友情链接</h3>
                            <a href="javascript:;">Study课堂</a>
                            <a href="javascript:;">Study集团</a>
                            <a href="javascript:;">Study</a>
                        </li>
                    </ul>
                </div>
                <div class="code" id="code">
                    <img src="images/code.png" alt="">
                </div>
                <span class="angle" id="angle"></span>
            </div>
            <div class="bottom">
                <div>
                    广西来宾市兴宾区铁北大道966号 邮编:123456 Email:abcdefg@xxx.edu.cn <br>
                </div>
                <div>
                    <a href="javascript:;"> 桂ICP备123456789号 </a> 版权所有 © 广西科技师范学院
                </div>
                <div style="margin-bottom:0;">
                    桂公网安备 1234567890号
                </div>
            </div>
        </div>
    </div>
    <script>
        $(function() {
            // 主页轮播图滚动
            $('.carousel').carousel({
                intervar: 1000
            });
        })
    </script>
</body>

</html>